<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="/static/all.css">
</head>
<body>
    <h1>
        {{title}}
    </h1>

    <h1>
        <a href="/add">添加</a>
        <hr>
    </h1>

    <ul>
        {% for data in datas %}
            {% if data.done%}
                <li class="done">
                    <input type="checkbox" checked onclick="changeStatus({{data.id}})">
                    {{data.id}} - {{data.title}}
                    <a href="/remove/{{data.id}}">删除</a>
                </li>
            {% else %}
                <li>
                    <input type="checkbox" onclick="changeStatus({{data.id}})">
                    {{data.id}} - {{data.title}}
                    <a href="/remove/{{data.id}}">删除</a>
                </li>
            {% endif %}
        {% endfor %}
    </ul>


    <script>
        function changeStatus(id){
            location.href='/change/'+id;
            // return false;
        }
    </script>
</body>
</html>